<template>
  <!-- 选择奖项信息 -->
  <div>
    <a-button type="primary" class="ml12" icon="pushpin" @click="visible = true">选择</a-button>
    <DialogForm
      :customFooter="true"
      ref="dialogForm"
      headerTitle="选择质量创优奖项"
      :visible.sync="visible"
      :width="1300"
    >
      <template slot="formHeader">
        <!-- 搜索 -->
        <searchData ref="searchData" :searchData="searchArr" @search="handleRefresh"></searchData>
        <!-- 表格 -->
        <b-table
          ref="table"
          tableLayout="fixed"
          rowKey="id"
          size="default"
          :columns="columns"
          :outSelectedRowKeys.sync="selectedRowKeys"
          @row-click="
            (a, e) => {
              selectedRow = e
            }
          "
          :selectConfig="{ use: true, type: 'radio', rowKey: 'id' }"
          :request="loadData"
        ></b-table>
      </template>
      <template slot="footer">
        <a-button
          type="primary"
          @click="
            $refs.searchData.form.resetFields()
            visible = false
          "
          class="button_right"
        >
          关闭
        </a-button>
        <a-button type="primary" :disabled="!selectedRowKeys || !selectedRowKeys.length" @click="handleConfirm">
          确认选择
        </a-button>
      </template>
    </DialogForm>
  </div>
</template>

<script>
import { excellenceTable } from '@/api/quality/quality' // api
import DialogForm from '@/components/DialogForm' // 弹窗
import Selector from '@/components/Select/Selector' // 选择器

export default {
  name: 'ChooseModel',
  components: {
    DialogForm
  },
  data() {
    return {
      visible: false, // 奖项信息弹窗显隐控件
      selectedRowKeys: [], // 奖项信息选中id集合
      selectedRow: {}, // 奖项信息选中对象集合
      dataSource: [], // 奖项信息列表
      queryParam: {}, // 筛选参数
      searchArr: [
        // 搜索框
        {
          name: '奖项名称',
          type: Selector,
          selectType: '52',
          valueKey: 'prizeNameId'
        },
        {
          name: '奖项类别',
          type: Selector,
          selectType: '49',
          valueKey: 'prizeTypeId'
        }
      ],
      columns: [
        {
          title: '奖项名称',
          dataIndex: 'name',
          ellipsis: true
        },
        {
          title: '奖项类别',
          dataIndex: 'prizeTypeName',
          ellipsis: true
        },

        {
          title: '主管单位',
          dataIndex: 'directorUnit',
          ellipsis: true
        },
        {
          title: '评审时间',
          dataIndex: 'reviewMonth'
        },
        {
          title: '创建人',
          dataIndex: 'filler'
        }
      ], // 表头
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        const requestParameters = Object.assign({}, parameter, this.queryParam)
        return excellenceTable.getList(requestParameters).then((res) => {
          return res
        })
      }
    }
  },
  props: {
    // 表单
    form: {
      type: Object,
      default: () => ({})
    }
  },
  methods: {
    /**
     * @description: 刷新表格
     */
    handleRefresh(value) {
      value && (this.queryParam = value)
      this.$refs.table.refresh(true)
    },
    /**
     * @description: 关联奖项信息后回调
     */
    handleConfirm() {
      this.$set(this.form, 'recordId', this.selectedRow?.id)
      this.$set(this.form, 'recordName', this.selectedRow?.name)
      // 重置搜索表单
      this.$refs.searchData?.form.resetFields()
      this.visible = false
    }
  }
}
</script>